<!--
 * @description  :窝点情报维护
 * @descriptionDetail:窝点情报维护
 * @copyright    : 浙江烟草
 * @author       : dw
 * @create       : 2022-10-13 09:15:17
-->
<template>
  <view class="page">
    <!-- #ifdef H5-ONLY -->
    <theme-navbar title="窝点情报维护"></theme-navbar>
    <!-- #endif -->
    <view class="content content-bg ifn-content" style="background-color: white; margin-left='10rpx'">
      <u-form
        class="u-form-m"
        :label-style="labelStyle"
        :model="baseInfo"
        :error-type="['border-bottom', 'message',]"
        label-width="auto"
        label-position="top"
        ref="uForm"
      >
        <u-form-item
          label="窝点名称" prop="name" :required="true"
          label-width="100rpx"
        >
          <u-input v-model="baseInfo.name" :disabled="isDisabled" placeholder="请输入"></u-input>
        </u-form-item>
        <u-form-item label="登记单位" :required="true" prop="orgName">
          <u-input :disabled="true" :custom-style="pointerStyle" placeholder="请选择" v-model="baseInfo.orgName"></u-input>
        </u-form-item>
        <u-form-item label="窝点类型" :required="true" prop="type">
          <dic-input
            :keyWord="$u.dic.DIC_KEYS.C_DENS_TYPE"
            :dicCode="baseInfo.type"
            :border="false"
            type="select"
            :select-open="dicSelectOpen('type',$u.dic.DIC_KEYS.C_DENS_TYPE)"
            placeholder="请选择"
            :disabled="true"
						:custom-style="pointerStyle"
            v-model="baseInfo.typeName"
            @changeInputModelData="(name)=>{$set(baseInfo, 'typeName', name)}"
            @click="showDic($u.dic.DIC_KEYS.C_DENS_TYPE,baseInfo.type,'type')"
          />
        </u-form-item>
        <u-form-item label="窝点小类" :required="true" prop="subtype">
          <dic-input
            :keyWord="$u.dic.DIC_KEYS.C_DENS_SUBTYPE"
            :dicCode="baseInfo.subtype"
            :border="false"
            type="select"
            :select-open="dicSelectOpen('subtype',$u.dic.DIC_KEYS.C_DENS_SUBTYPE)"
            placeholder="请选择"
            :disabled="true"
						:custom-style="pointerStyle"
            v-model="baseInfo.subtypeName"
            @changeInputModelData="(name)=>{$set(baseInfo, 'subtypeName', name)}"
            @click="showDic($u.dic.DIC_KEYS.C_DENS_SUBTYPE,baseInfo.subtype,'subtype')"
          />
        </u-form-item>
        <u-form-item label="窝点持有人" right-icon="arrow-right">
          <u-input
            v-model="baseInfo.handler" placeholder="请选择" :custom-style="pointerStyle" :disabled="true"
            @click="handlerSelect(1)"
          ></u-input>
        </u-form-item>
        <u-form-item label="窝点管理人" right-icon="arrow-right">
          <u-input
            v-model="baseInfo.manager" placeholder="请选择" :custom-style="pointerStyle" :disabled="true"
            @click="handlerSelect(0)"
          ></u-input>
        </u-form-item>
        <u-form-item
          label="所在地" :border-bottom="false" prop="denProvCityCounty"
          :required="true"
        >
          <view style="display: flex; flex-direction: column; width: 100%">
            <u-input
              type="select"
              :disabled="true"
							:custom-style="pointerStyle"
              placeholder="所在地选择"
              v-model="baseInfo.denProvCityCounty"
              @click=" (nativeNameSelectShow = !isDisabled)"
            ></u-input>
            <u-line :color="$theme.u_border_color" style="margin-top: 20rpx"></u-line>
          </view>
        </u-form-item>
        <u-form-item prop="address">
          <u-input
            :border="true" placeholder="地址" :disabled="isDisabled"
            v-model="baseInfo.address"
          ></u-input>
        </u-form-item>
        <u-form-item prop="lonlat" :required="true" label="经纬度">
          <!-- placeGisX placeGisY -->
          <u-input
            placeholder="请选择" :disabled="true" :custom-style="pointerStyle" :needValid="!isDisabled"
            v-model="baseInfo.lonlat"
          ></u-input>
          <u-icon
            name="map-fill" :color="$theme.u_type_primary" size="50"
            @click="getLocation()"
          ></u-icon>
        </u-form-item>
        <u-form-item label="所属网格" right-icon="arrow-down-fill" :right-icon-style="iconStyle">
          <u-input
            :disabled="true" placeholder="请选择" :custom-style="pointerStyle" v-model="baseInfo.gridName"
            @click="orgSelectShow = true"
          ></u-input>
        </u-form-item>
        <u-form-item label="活动规律">
          <u-input v-model="baseInfo.law" placeholder="请输入"></u-input>
        </u-form-item>
        <u-form-item label="窝点状态" prop="status" :required="true">
          <dic-input
            :keyWord="$u.dic.DIC_KEYS.S_SYS_IS_ACTIVE"
            :dicCode="baseInfo.status"
            :border="false"
            type="select"
            :select-open="dicSelectOpen('status',$u.dic.DIC_KEYS.S_SYS_IS_ACTIVE)"
            placeholder="请选择"
            :disabled="true"
						:custom-style="pointerStyle"
            v-model="baseInfo.statusName"
            @changeInputModelData="(name)=>{$set(baseInfo, 'statusName', name)}"
            @click="showDic($u.dic.DIC_KEYS.S_SYS_IS_ACTIVE,baseInfo.status,'status')"
          />
        </u-form-item>
        <u-form-item label="备注" :border-bottom="false">
          <u-input v-model="baseInfo.remark" type="textarea" placeholder="请输入"></u-input>
        </u-form-item>
      </u-form>
    </view>
    <view class="u-form">
      <u-gap :height="$theme.cm_section_top_gap_height" :bg-color="$theme.cm_gap_color"></u-gap>
      <fsection :title="title.img" :customStyle="customStyle"></fsection>
    </view>
    <view class="u-form-m pl-10">
      <m-upload
        :uploadParam="fileUploadParam" upApiUrl="uploadBase64ForApp" :fileList="fileList"
        @on-list-change="changeUpload"
      ></m-upload>
    </view>
    <view class="submit-btns bottom-btns">
      <u-button class="del" type="primary" @click="submit">
        保&nbsp;&nbsp;&nbsp;&nbsp;存
      </u-button>
    </view>
    <u-popup mode="bottom" height="80%" v-model="nativeNameSelectShow">
      <area-select :choiceAll="true" @choose="nativeNameSelectShowComfir"></area-select>
    </u-popup>
    <!-- 组织机构选择 -->
    <u-popup mode="bottom" height="80%" v-model="orgSelectShow">
      <org-select
        :cleanParentOrg="true" limitNodeType="07" treeType="zm-all"
        tips="请选择所属网格" @choose="handlerChooseOrg"
      ></org-select>
    </u-popup>
    <!-- 字典单选 -->
    <dic-choice
      :keyWord="dicKeyWords"
      :currentSelect="dicCurrentSelect"
      v-model="dicShow"
      @confirm="selectDicConfirm"
      :extFilterFun="extFilterFun"
    ></dic-choice>
  </view>
</template>

<script>
import areaSelect from '@/components/area-select.vue';
import DicInput from '@/components/dic_input.vue';
import DicChoice from '@/components/dic_choice.vue';
import OrgSelect from '@/components/org-select.vue';
import intelligenceservice from '@/service/intelligence/intelligence.service';
import MUpload from '@/components/m-upload.vue';
import fsection from '@/components/form-section.vue';
import commonService from '@/service/common/common.service.js';
import { uuid, } from '@/common/util.js';
import certificateService from '@/service/certificate/certificate.service.js';
import { C_DENS_TYPE, } from '@/service/intelligence/mapping/enum.js';
export default {
  components: {
    areaSelect,
    OrgSelect,
    DicChoice,
    DicInput,
    MUpload,
    fsection,
  },
  data() {
    return {
      customStyle: {
        padding: '20rpx 32rpx',
      },
      fileUploadParam: {
        fiGroupCode: this.$FILE_GROUP_TYPE.k_den_attr,
        bizId: '',
      },
      rules: {
        name: [
          {
            required: true,
            message: '请输入窝点名称',
            // 可以单个或者同时写两个触发验证方式
            trigger: ['change', 'blur',],
          },
        ],
        orgUuid: [
          {
            required: true,
            message: '请选择登记单位',
            trigger: ['change', 'blur',],
          },
        ],
        type: [
          {
            required: true,
            message: '请选择窝点类型',
            trigger: ['change', 'blur',],
          },
        ],
        subtype: [
          {
            required: true,
            message: '请选择窝点小类',
            trigger: ['change', 'blur',],
          },
        ],
        lonlat: [
          {
            required: true,
            message: '请选择经纬度',
            trigger: ['change', 'blur',],
          },
        ],
        denProvCityCounty: [
          {
            required: true,
            message: '请选择所在地',
            // 可以单个或者同时写两个触发验证方式
            trigger: ['change', 'blur',],
          },
        ],
        address: [
          {
            required: true,
            message: '请输入地址',
            // 可以单个或者同时写两个触发验证方式
            trigger: ['change', 'blur',],
          },
        ],
        status: [
          {
            required: true,
            message: '请选择窝点状态',
            // 可以单个或者同时写两个触发验证方式
            trigger: ['change', 'blur',],
          },
        ],
      },
      baseInfo: {
        name: '', // 窝点名称
        orgUuid: '', // 登记单位Uuid
        orgName: '', // 登记单位
        type: '', // 窝点类型
        // typeName:"",// 窝点类型文字
        subtype: '', // 窝点小类
        // subtypeName:'',
        handler: '', // 窝点持有人
        manager: '', // 管理人
        denProvCityCounty: '', // 所在地
        prov: '', // 省份
        city: '', // 市
        county: '', // 区（县、乡）
        address: '', // 窝点地址
        lonlat: '', // 经纬度
        law: '', // 活动规律
        remark: '', // 备注
        grid: '', // 所属网格
        uuid: '',
        longitude: '',
        latitude: '',
        status: '',
      },
      labelStyle: {
        fontWeight: 400,
        color: this.$theme.u_main_color,
        fontSize: '.75rem',
      },
      iconStyle: {
        color: '#c0c4cc',
      },
      title: {
        img: '图片信息',
        connectMsg: '窝点情报维护新增',
      },
      from: 'add',
      empty: false,
      nativeNameSelectShow: false,
      mulitChoiceShow: false,
      orgSelectShow: false,
      dicKeyWords: '',
      dicCurrentSelect: '',
      dicShow: false,
      user: this.$storage.get(this.$rp.common.USER),
      fileList: [],
      isDisabled: false,
      densType: '',
			// h5端部分浏览器input设置disabled后点击事件失效 2023-10-27 fsx start
			pointerStyle: {
			  marginRight: "5px",
				pointerEvents: "none !important"
			},
			// h5端部分浏览器input设置disabled后点击事件失效 2023-10-27 fsx end
    };
  },
  onLoad(opt) {
    this.from = opt.from;
    if (this.from == 'edit') {
      this.isDisabled = false;
      this.baseInfo = this.getRouteParam();
      console.log('this.getRouteParam():', this.getRouteParam());
      this.densType = this.baseInfo.type == C_DENS_TYPE.IPRODUCT_DENS ? C_DENS_TYPE.IPRODUCT_DENS_BBNAME : C_DENS_TYPE.STORE_DENS_BBNAME;
      if (this.$u.test.isEmpty(this.baseInfo.longitude) && this.$u.test.isEmpty(this.baseInfo.latitude)) {
        this.baseInfo.lonlat = '';
      } else {
        this.baseInfo.lonlat = `${this.baseInfo.longitude},${this.baseInfo.latitude}`;
      }
      this.fileUploadParam.bizId = this.baseInfo.uuid;
      if (this.$u.test.isEmpty(this.baseInfo.city) && this.$u.test.isEmpty(this.baseInfo.county)) {
        this.baseInfo.denProvCityCounty = this.baseInfo.provName;
      } else if (this.$u.test.isEmpty(this.baseInfo.county)) {
        this.baseInfo.denProvCityCounty = this.baseInfo.provName + '/' + this.baseInfo.cityName;
      } else if (!this.$u.test.isEmpty(this.baseInfo.county)) {
        this.baseInfo.denProvCityCounty = this.baseInfo.provName + '/' + this.baseInfo.cityName + '/' + this.baseInfo.countyName;
      } else if (!this.$u.test.isEmpty(this.baseInfo.prov)) {
        this.baseInfo.denProvCityCounty = '';
      }
    } else {
      this.baseInfo.uuid = uuid();
      this.fileUploadParam.bizId = this.baseInfo.uuid;
      if (this.user.orgLevel === 1) {
        this.baseInfo.orgName = this.user.provOrgName;
        this.baseInfo.orgUuid = this.user.provOrgUuid;
      } else {
        this.baseInfo.orgName = this.user.townOrgName;
        this.baseInfo.orgUuid = this.user.townOrgUuid;
      }
    }
  },
  onReady() {
    this.$refs.uForm.setRules(this.rules);
    this.getListViewTop();
  },
  created() {
    this.initAuditImage();
  },
  methods: {
    selectDicConfirm(e) {
      if (this.dicKeyWords == this.$u.dic.DIC_KEYS.C_DENS_TYPE) {
        // 窝点类型
        this.baseInfo.typeName = e[0].label;
        this.baseInfo.type = e[0].extra.bcbCode;
        this.densType = e[0].extra.bcbPhName;
        this.baseInfo.subtypeName = '';
        this.baseInfo.subtype = '';
      } else if (this.dicKeyWords == this.$u.dic.DIC_KEYS.C_DENS_SUBTYPE) {
        // 窝点小类
        this.baseInfo.subtypeName = e[0].label;
        this.baseInfo.subtype = e[0].extra.bcbCode;
      } else if (this.dicKeyWords == this.$u.dic.DIC_KEYS.S_SYS_IS_ACTIVE) {
        // 窝点状态
        this.baseInfo.statusName = e[0].label;
        this.baseInfo.status = e[0].extra.bcbCode;
      }
    },
    // 上传/删除图片事件
    changeUpload(list, key) {
      if (list.length > 0) {
        this.fileList = [...list,];
      } else {
        this.fileList = [];
      }
    },
    dicSelectOpen(type, keyWords) {
      if (type == this.dicType) {
        if (this.dicKeyWords == keyWords && this.dicShow) {
          return true;
        }
        return false;
      }
    },
    // 窝点类型过滤处理
    extFilterFun(itm, keyWord) {
      if (keyWord == this.$u.dic.DIC_KEYS.C_DENS_TYPE) {
        return itm.ext1 == 'clue';
      } else if (keyWord == this.$u.dic.DIC_KEYS.C_DENS_SUBTYPE) {
        if (this.densType == 'IPRODUCT_DENS') {
          return itm.ext1 != '9007';
        } else if (this.densType == 'STORE_DENS') {
          return itm.ext1 != '9006';
        } else {
          return true;
        }
      }
      return true;
    },
    handlerSelect(type) {
      this.$u.route('pages/intelligence/components/personConnectInfo?type=' + type);
    },
    showDic(key, cur, type) {
      if (this.dicShow || this.isDisabled) return;
      this.dicKeyWords = key;
      this.dicCurrentSelect = cur;
      this.dicShow = true;
      this.dicType = type;
    },
    getListViewTop() {
      this.$u.getRect('.case-search-lay').then((res) => {
        this.listViewTop = this.$u.sys().statusBarHeight + res.top + res.height + 'px';
      });
      this.$u.getRect('.submit-btns').then((res) => {
        this.bottomOffset = this.$u.sys().screenHeight - res.top + 'px';
      });
    },
    initAuditImage() {
      certificateService
        .goFiles(this.baseInfo.uuid, this.$FILE_GROUP_TYPE.k_den_attr)
        .then((res) => {
          if (res.success) this.fileList = res.data;
        })
        .catch((e) => {
          console.log(e);
        });
    },
    handlerChooseOrg(orgs) {
      this.baseInfo.grid = orgs[0].id;
      this.baseInfo.gridName = orgs[0].name;
      this.orgSelectShow = false;
    },
    updateBackState(param) {
      if (param.pos) {
        //  定位
        // 回显经纬度
        this.baseInfo.longitude = param.pos.longitude;
        this.baseInfo.latitude = param.pos.latitude;
        this.baseInfo.lonlat = `${param.pos.longitude},${param.pos.latitude}`;
        let addressName = param.pos.regeocode.addressComponent;
        console.log('===' + JSON.stringify(param.pos));
        let area = commonService.getLocalName(addressName.province, addressName.city, addressName.district);
        if (this.$modal.isMuniCity(area.proCode)) {
          this.baseInfo.denProvCityCounty = area.admdivName + area.areaName;
        } else {
          this.baseInfo.denProvCityCounty = area.proName + area.admdivName + area.areaName;
        }
        this.baseInfo.prov = area.proCode;
        this.baseInfo.city = area.admdivCode;
        this.baseInfo.county = area.countryCode;
        this.baseInfo.address = addressName.township + addressName.street + addressName.streetNumber;
        this.$forceUpdate();
      } else if (param.refresh) {
        this.baseInfo.handler = param.refresh[0].name;
      } else if (param.hold) {
        this.baseInfo.manager = param.hold[0].name;
      }
    },
    nativeNameSelectShowComfir(areas) {
      if (this.$u.test.isEmpty(areas[0].admdivCode) && this.$u.test.isEmpty(areas[0].countryCode)) {
        this.baseInfo.denProvCityCounty = areas[0].proName;
      } else if (this.$u.test.isEmpty(areas[0].countryCode)) {
        this.baseInfo.denProvCityCounty = areas[0].proName + '/' + areas[0].admdivName;
      } else if (!this.$u.test.isEmpty(areas[0].countryCode)) {
        this.baseInfo.denProvCityCounty = areas[0].proName + '/' + areas[0].admdivName + '/' + areas[0].countryName;
      } else if (!this.$u.test.isEmpty(areas[0].proCode)) {
        this.baseInfo.denProvCityCounty = '';
      }
      this.baseInfo.prov = areas[0].proCode;
      this.baseInfo.city = areas[0].admdivCode;
      this.baseInfo.county = areas[0].countryCode;
      this.nativeNameSelectShow = false;
    },
    getLocation() {
      if (this.isDisabled) return;
      this.setRouteParam({ disable: false, step: 'start', });
      this.$u.route('pages/commonPage/modifyLocationMap');
    },
    submit() {
      this.$refs.uForm.validate((valid) => {
        if (valid) {
          let params = this.baseInfo;
          this.$modal.showLoading('保存中...');
          intelligenceservice
            .saveHideoutInfo(params)
            .then((res) => {
              this.$modal.hideLoading();
              if (res.success) {
                this.baseInfo = res.data;
                this.backPrev({
                  paramKey: 'refresh',
                  param: true,
                });
              } else {
                this.$u.toast(res.msg);
              }
            })
            .catch((err) => {
              this.$modal.hideLoading();
              console.log(err);
              this.$u.toast(err.msg);
            });
        } else {
          console.log('验证失败');
        }
      });
    },
    close() {
      this.$u.route('pages/intelligence/hideoutList');
    },
    S4() {
      return (((1 + Math.random()) * 0x10000) | 0).toString(16).substring(1);
    },
    uuid() {
      let uuid = this.S4() + this.S4() + '-' + this.S4() + '-' + this.S4() + '-' + this.S4() + '-' + this.S4() + this.S4() + this.S4();
      return uuid.replace(/-/g, '');
    },
  },
};
</script>

<style scoped lang="scss">
	@import './add.scss';
</style>
